<template>
	<page-meta>
	    <navigation-bar
			title="设备检修记录--编辑"
			background-color="#EEEEEE"
			front-color="#ffffff "
	    />
	</page-meta>
	<view style="margin: 20px;">
	    <view class="basicInfo">
			<uni-section title="基本信息" type="line"></uni-section>
			<view class="example-body message">
				<view>
					<view class="itemTr"><text decode="true">站台名称:&nbsp;&nbsp;&nbsp;&nbsp;{{repairLogInfo.stationName}}</text></view>
					<view class="itemTr"><text decode="true">专业:&nbsp;&nbsp;&nbsp;&nbsp;{{repairLogInfo.domain}}</text></view>
					<view class="itemTr"><text decode="true">系统名称:&nbsp;&nbsp;&nbsp;&nbsp;{{repairLogInfo.systemName}}</text></view>
					<view class="itemTr"><text decode="true">设备类型:&nbsp;&nbsp;&nbsp;&nbsp;{{repairLogInfo.eventType}}</text></view>
					<view class="itemTr"><text decode="true">设备名称:&nbsp;&nbsp;&nbsp;&nbsp;{{repairLogInfo.eventName}}</text></view>
					<view class="itemTr"><text decode="true">维修方式:&nbsp;&nbsp;&nbsp;&nbsp;{{repairLogInfo.maintainWay}}</text></view>
				</view>
			</view>
			<form @submit="submitForm">
				<uni-section title="更新维修记录" type="line"></uni-section>
				<view class="example-body message">
					<view class="layui-col-md6">
						<view class="layui-form-item">
							<label class="layui-form-label">检修日期：</label>
							<view class="layui-inline">
								<i class="layui-icon layui-icon-date"></i>
								<input
									name="maintainDate"
									ref="maintainDate" 
									:value="submitData.maintainDate" 
									placeholder="请选择时间" 
									autocomplete="off" 
									class="uni-input"
									@click="showPop($event, 'maintainDate')"
									disabled >
							</view>
						</view>
						<view class="layui-form-item">
							<label class="layui-form-label">检修方式：</label>
							<input name="maintainWay" placeholder="请输入" autocomplete="off" class="uni-input" :value="submitData.maintainWay">
						</view>
						<view class="layui-form-item">
							<label class="layui-form-label">检修人员：</label>
							<input name="maintainPerson" placeholder="请输入" autocomplete="off" class="uni-input" :value="submitData.maintainPerson">
						</view>
						<view class="layui-form-item">
							<label class="layui-form-label">维修状态:</label>
							<view class="layui-inline">
								<xfl-select
									:list="statuList"
									:clearable="true"
									:showItemNum="5" 
									:listShow="false"
									:isCanInput="false"  
									:style_Container="'height: 50px; font-size: 16px;'"
									:initValue="submitData.taskStatu"
									:option="optionConf"
									@change="statuChange($event)"
									@clear="statuChange($event)"
									:selectHideType="'hideAll'"></xfl-select>
							</view>
						</view>
						<view class="layui-form-item">
							<label class="layui-form-label">检修内容：</label>
							<input name="maintainContent" placeholder="请输入" autocomplete="off" class="uni-input" :value="submitData.maintainContent">
						</view>
						<view class="layui-form-item">
							<label class="layui-form-label">具体描述：</label>
							<textarea  name="describe" placeholder="请输入" autocomplete="off" class="uni-textarea" :value="submitData.describe" />
						</view>
					</view>
				</view>
				<view class="submit-button">
				  <button type="primary" form-type="submit">确定</button>
				</view> 
			</form>
			
			<minPopup heightSize="500" :show="show" @close='close'>
				<minPicker 
					:endTime="endTime" 
					:startTime="startTimes" 
					@cancel="cancel" 
					@sure="sure"></minPicker>
			</minPopup>
		</view>
	</view>
</template>

<script>
	
import minPicker from '@/components/min-picker/min-picker.vue'
import minPopup from '@/components/min-picker/min-popup.vue'
import uniPagination from '@/components/uni-pagination/uni-pagination.vue'
import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue'
	
export default {
	data () {
		return {
			repairLogInfo: {},
			startTimes:[2010,6,1],
			endTime: 2100,
			show:false,
			targetInputData: '',
			submitData: {
				taskNum: '',
				maintainDate: '',
				maintainWay: '',
				maintainPerson: '',
				taskStatu: '',
				maintainContent: '',
				describe:''
			},
			optionConf: {
				label: 'label',
				value: 'value'
			},
			statuList: [],
			mtRecordList: [],
			mtRecordTotal: 0,
			errorMessage: '',
		}
	},
	methods: {
		initMtRecord(currentPage, pageSize) {
			this.$myRequest({
				url: '/alertManager/queryMtRecord',
				method: 'POST',
				data: {
					limit: pageSize,
					page: currentPage
				}
			}).then(rep => {
				this.mtRecordList = rep.rows
				this.mtRecordTotal = rep.total
			})
		},
		statuChange (e) {
			if (e) {
				this.submitData.taskStatu = e.newVal.value
			} else {
				this.submitData.taskStatu = ''
			}
		},
		// ------------------日期选择器----------------------
		// 取消事件
		cancel(){
		    this.close()
		},
		// 确认事件
		sure(e){
			this.submitData[this.targetInputData] = e.a + '-' + e.b + '-' + e.c
		    // 输出 { year: 100100,month: 3,day: 23}
		},
		// picker显示
		showPop(event, paramName){
			this.targetInputData = paramName
		    this.show = true
		},
		// 关闭picker
		close(){
		    this.show = false
		},
		
		//-----------------------------------------------
		submitForm (e) {
			let inputDatas = e.detail.value
			if(this.submitData.maintainDate === this.repairLogInfo.maintainDate 
				&& this.submitData.maintainWay === this.repairLogInfo.maintainWay
				&& this.submitData.maintainPerson === this.repairLogInfo.maintainPerson
				&& this.submitData.taskStatu === this.repairLogInfo.taskStatu
				&& this.submitData.maintainContent === this.repairLogInfo.maintainContent
				&& this.submitData.describe === this.repairLogInfo.describe){
				uni.navigateTo({
					url:'./equipmentRecord',
					success: res => {
						console.log('跳转成功');
					},
					fail: res => {
						console.log(res);
					},
				});
			}else {
				uni.showLoading({
					title:"修改中，请稍等...",
					mask:true
				});
				this.$myRequest({
					url: '/et/maintain/updateRecords',
					method: 'POST',
					data: this.submitData
				}).then(rep => {
					if(rep.code === 'success' || rep.message === '更新成功'){
						uni.navigateTo({
							url:'./equipmentRecord',
							success: res => {
								console.log('跳转成功');
							},
							fail: res => {
								console.log(res);
							},
						});
					}else {
						this.$refs.popupMessage.open()
						this.errorMessage = rep.message
					}
				})
			}
		},
		pageChange (e) {
			this.initMtRecord(e.current,10)
		}
	},
	components:{
		minPicker,
		minPopup,
		uniPagination,
		uniPopupMessage,
	},
	onLoad: function (option) {
		const item = JSON.parse(decodeURIComponent(option.repairLogInfo));
		const statuList = JSON.parse(decodeURIComponent(option.statuList));

		this.repairLogInfo = item
		this.statuList = statuList
		this.submitData.taskNum = item.taskNum
		this.submitData.maintainDate = item.maintainDate
		this.submitData.maintainWay = item.maintainWay
		this.submitData.maintainPerson = item.maintainPerson
		this.submitData.taskStatu = item.taskStatu
		this.submitData.maintainContent = item.maintainContent
		this.submitData.describe = item.describe
	},
	created: function () {
	},
}
</script>

<style>
	
	.uni-textarea {
		height: 100rpx;
		width: 645rpx;
		padding: 15rpx 25rpx 15px;
		line-height:40rpx;
		font-size:28rpx;
		background:#FFF;
		flex: 1;
	}
	
	.submit-button {
		margin: 50rpx 30rpx 0rpx;
	}
</style>
